<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="__PUBLIC__/asset/css/common.css">
    <style>
        .router-box {
            margin: 8vh 0 4vh;
        }

        .router-item {
            font-size: calc(16px + 0.1vw);
            display: inline-block;
            color: black;
        }

        .router-item:hover {
            color: var(--themeColor);
            opacity: 1 !important;
        }

        .now-router {
            color: var(--themeColor);
        }

        .iconfont {
            margin: 0 20px;
        }

        @media screen and (max-width:1400px) {
            .router-menu {
                padding-top: 7rem;
            }

            .router-box {
                margin: 4vh 0;
                padding: 20px;
            }
        }

        @media screen and (max-width:768px) {
            .router-box {
                margin: 20px 0;
                padding: 20px;
            }
        }
    </style>
</head>

<body>
    <div class="middle-box">
        <div class="router-box">
            <!-- <a class="router-item">首頁</a>
            <i class="iconfont icon-youshuangjiantou now-router"></i>
            <a class="router-item now-router">信息中心</a> -->
        </div>
    </div>
</body>
<script src="__PUBLIC__/asset/lib/jquery_3.2.1.min.js"></script>
<script>
    $(document).ready(function (){
        let nowPath = location.pathname.match(/\/([^\/]+)\//);
        if(!nowPath){
            return;
        }
        nowPath = nowPath[1];

        let nowPathName = document.title
        // 只有信息詳情才處理第二個導航
        let pathHistory = nowPath == 'message' ? localStorage.getItem('path') || '' : ''
        if(pathHistory && JSON.parse(pathHistory)?.path && (location.origin + '/' == JSON.parse(pathHistory)?.path)){
            pathHistory = ''
        }
        // if(pathHistory){}
        $('.router-box').append(`
        <a class="router-item" href="../">首页</a>
        <i class="iconfont icon-youshuangjiantou now-router"></i>
        ${pathHistory ? `<a class="router-item" href="${JSON.parse(pathHistory).path}">${JSON.parse(pathHistory).name}</a>
        <i class="iconfont icon-youshuangjiantou now-router"></i>`: ''}
        <a class="router-item now-router">${nowPathName}</a>`)
    })
</script>

</html>